<script>
import addtable from '@/mixins/addtable'
import AjaxStore from '@/utils/store/proxyAjax'
export default {
  mixins: [addtable],
  data() {
    return {
      tableSelectionCol: false,
      labelWidth: '90px',
      tableOptWidth: '120',
      dialogType: '',
      dialogFenpeiTitle: '人员分配',
      dialogAuthorizeTitle: '角色授权',
      idKey: 'clientId',
      delIdKey: 'clientId',
      showInputFlag: false,

      store: new AjaxStore({
        url: '/v1/yq/sysApp/querySysAppPage'
      }),
      columns: [
        {
          prop: 'appName',
          label: '应用名称',
          sortable: true,
          width: '140',
          'show-overflow-tooltip': true,
          'header-align': 'center'
        },
        {
          prop: 'clientId',
          label: 'Client ID',
          sortable: true,
          'min-width': '220',
          'show-overflow-tooltip': true,
          'header-align': 'center'
        },
        {
          prop: 'resource',
          label: '资源ID',
          sortable: true,
          'min-width': '240',
          'header-align': 'center'
        },
        {
          prop: 'authorizedGrantTypes',
          label: '授权模式',
          sortable: true,
          'min-width': '240',
          'header-align': 'center',
          'show-overflow-tooltip': true,
          scopedSlots: {
            default: ({ row }) => (
              <span>{row.authorizedGrantTypes.join('，')}</span>
            )
          }
        }
      ],
      searchFields: [],
      searchModel: {},
      searchBtnList: [],
      toolPanelBtnList: this.toolPanelBtns,
      tableRowBtnList: this.tableRowBtnList
    }
  },
  methods: {
    handleCurrentChange() {},
    handleAdd() {
      this.handleBtns('', 1, 'newAddApplicat')
    },
    handleEdit(row) {
      this.handleBtns(row, 2, 'editApplicat')
    },
    handleLook(row) {
      this.handleBtns(row, 3, 'seeApplicatInfo')
    },
    // 创建-1 编辑-2、查看详情-3
    handleBtns(row, type, name) {
      if (row && row !== '') {
        this.$router.push({
          path: `/siteconfig/thirdmanage/src/${name}/${row.clientId}/${type}`
        })
      } else {
        this.$router.push({
          path: `/siteconfig/thirdmanage/src/${name}/${type}`
        })
      }
    },
    // 删除
    handleDelete(row) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.handleDeleteApi(row)
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    },
    // 删除api
    handleDeleteApi(row) {
      const params = {
        clientId: row.clientId
      }
      this.request({
        url: '/v1/yq/sysApp/deleteSysApp',
        params: params
      }).then(() => {
        this.$message.success('删除成功')
        this.$refs.table.load(1)
      })
    },
    renderOperateBtns(row) {
      if (row.projectIds) {
        return (
          <TableButtonList
            operateBtnList={this.tableRowBtnListWidthDisabled}
            props-model={row}
          />
        )
      }
      return (
        <TableButtonList
          operateBtnList={this.tableRowBtnList}
          props-model={row}
        />
      )
    }
  },
  beforeCreate() {
    const urlArr = ((this.$route.meta && this.$route.meta.children) || []).map(
      item => item.url
    )

    this.toolPanelBtns = [
      {
        label: '创建应用',
        methods: 'handleAdd',
        url: '',
        icon: 'el-icon-circle-plus-outline',
        type: 'primary',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.tableRowBtnList = [
      {
        label: '查看',
        methods: 'handleLook',
        url: '',
        // url: '/v1/yq/sysApp/getSysAppDetail',
        icon: 'el-icon-view',
        type: 'primary',
        key: 'edit',
        align: 'top-start',
        disabled: false
      },
      {
        label: '编辑',
        methods: 'handleEdit',
        url: '',
        // url: '/v1/yq/sysApp/getSysAppDetail',
        icon: 'el-icon-edit-outline',
        type: 'primary',
        key: 'edit',
        align: 'top-start',
        disabled: false
      },
      {
        label: '删除',
        methods: 'handleDelete',
        url: '',
        // url: '/v1/sys/role/delete',
        icon: 'el-icon-delete',
        type: 'danger',
        key: 'delete',
        align: 'top-start',
        disabled: false
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)

    this.tableRowBtnListWidthDisabled = [
      {
        label: '查看',
        methods: 'handleLook',
        url: '',
        // url: '/v1/yq/sysApp/getSysAppDetail',
        icon: 'el-icon-view',
        type: 'primary',
        key: 'edit',
        align: 'top-start',
        disabled: false
      },
      {
        label: '编辑',
        methods: 'handleEdit',
        url: '',
        // url: '/v1/yq/sysApp/getSysAppDetail',
        icon: 'el-icon-edit-outline',
        type: 'primary',
        key: 'edit',
        align: 'top-start',
        disabled: false
      },
      {
        label: '删除',
        methods: 'handleDelete',
        url: '',
        // url: '/v1/sys/role/delete',
        icon: 'el-icon-delete',
        type: 'danger',
        key: 'delete',
        align: 'top-start',
        disabled: true
      }
    ].filter(item => (item.url && urlArr.includes(item.url)) || !item.url)
  }
}
</script>

<style lang="scss"></style>
